import { Story, Canvas, ArgsTable, Source } from '@storybook/addon-docs/blocks';
import Pagination from '../Pagination.svelte';

# Pagination

<p>Pagination component design specification.</p>

## Usage

<p></p>

### Basic

<Canvas withSource="none">
  <Story name="basic" id="components-pagination--basic" />
</Canvas>

<Source language='html' code={`
<script>
  import { Pagination } from '@mathesar-component-library';
<\/script>

<Pagination {total}/>
`}/>

### Multiple Pages

<Canvas withSource="open">
  <Story id="components-pagination--multiple-pages" />
</Canvas>

## Arguments

<ArgsTable of={Pagination} />
